// //定义函数组件
// const Tr = () => {
//     return (
//         <>
//             <tr>
//                 <td>1</td>
//                 <td>admin</td>
//             </tr>
//         </>
//     )
// }

// const App = () => {// react提供空标签
//     return (
//         <>
//             <table>
//                 <thead>
//                     <tr>
//                         <th>ID</th>
//                         <th>姓名</th>
//                     </tr>
//                 </thead>
//                 <tbody>
//                     <Tr />
//                 </tbody>
//             </table>
//         </>
//     )
// }

// // 导出
// export default App;


import React from 'react';
class App extends React.Component {
    constructor(props) {
        super(props)

        // 属性
        this.state = {
            tips: 'Hello World',
            showClock: true
        }
        console.log(this.state);
    }
    ChangeDisplay() {
        this.setState({
            showClock: !this.state.showClock
        })
        console.log(this.state);
    }

    UpdateTips() {
        this.setState({
            tips: 'React Update'
        })
    }
    render() {
        return (
            <>
                {this.state.showClock}
                {this.state.tips}
                <button onClick={() => this.UpdateTips()}>更新tips</button>
                <button onClick={() => this.ChangeDisplay()}>改变显隐</button>
            </>
        )
    }
}

// 导出
export default App;